<template>
	<view class="content login_content">
		<view v-if="dataList.length>0">
			<view class="bottom_item" v-for="(item, index) in dataList" :key="index" @click="detail(item)">
				<view class="item_content">
					<view class="content_title">按摩{{ item.massagetimelong }}分钟</view>
					<view class="content_address">{{ item.address }}</view>
					<view class="content_time">{{ item.createtime }}</view>
				</view>
				<view class="item_amount">
					<view class="amount">{{ item.orderactualamount }}<span>元</span></view>
				</view>
			</view>
		</view>
		<emptyPage v-else></emptyPage>

	</view>
</template>
<script>
import { recordsList} from '@/api/massageChair';
import { toast, showConfirm, tansParams } from '@/utils/common'
import emptyPage from "@/components/emptyPage/index.vue";
export default {
	name: 'recordConsumer',
	components: {emptyPage},
	created() {
		this.getRecordsList()
	},
	data() {
		return {
			dataList: []
		};
	},
	methods: {

	async getRecordsList() {
		const res=await recordsList();
	
	if (res.results.code == 200) {
       	this.dataList = res.results.data;
      } else {
        toast(res.results.message)
      }
	},
	detail(item) {
		uni.navigateTo({url:`/pages/massageChair/recordDetail?id=${item.orderid}`})

	}
	}
};
</script>
<style lang="scss">
page {
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	background-color: #f1f2f6;
	min-height: 100%;
	height: auto;
}

.content {
	padding: 22rpx 32rpx;

	.bottom_item {
		background-color: #fff;
		padding: 30rpx 24rpx;
		box-shadow: 0rpx 0rpx 20rpx 0rpx #E2E4ED;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin-top: 24rpx;
		display: flex;
		align-items: center;
		justify-content: space-between;

		.item_content {
			flex: 3;

			.content_title {
				font-size: 36rpx;
				font-weight: 600;
				color: #1F2E49;
			}

			.content_address {
				margin-top: 12rpx;
				font-size: 26rpx;
				font-weight: 400;
				color: #1F2E49;
				width: 400rpx;
				overflow: hidden;
				white-space: nowrap;
				text-overflow: ellipsis;
			}

			.content_time {
				margin-top: 10rpx;
				font-size: 26rpx;
				font-weight: 400;
				color: #76839B;
			}


		}

		.item_amount {
			flex: 1;

			.amount {
				font-size: 40rpx;
				font-weight: 600;
				color: #1F2E49;

				span {
					font-size: 32rpx;
					font-weight: 400;
					color: #1F2E49;
				}
			}

		}

	}







}</style>
